<template>
  <div id="feature">
    <SwiperCard :list='topList'/>
  </div>
</template>
<script lang="ts">
import { defineComponent, onMounted, reactive, toRefs } from 'vue'
import SwiperCard from '@/components/kit/SwiperCard/index.vue'
import api from '@/api/api'

export default defineComponent({
  name: 'Feature',
  components: { SwiperCard },
  setup() {
    const reactiveData = reactive({
      topList: '' as any
    })
    onMounted(() => {
      getTopList()
    })
    const getTopList = () => {
      api.getTopArticleList().then(({ data }) =>{
        reactiveData.topList=data.data
      })
    }
    return {
      ...toRefs(reactiveData)
    }
  }
})
</script>
